<template>
	<vxe-grid v-bind="gridOptions" :height="500" size="small" ref="grid">
		<template #opUserRes="{row}">更新成功{{ row.successNum }}份数据，失败{{ row.failNum }}份数据</template>
		<template #action="{row}">
			<a-button type="link" @click="downloadFailData(row)" v-show="row.failNum">下载失败数据</a-button>
		</template>
	</vxe-grid>
</template>
<script lang="ts" setup>
	import {pagerConfig} from 'yuxin-base/src/utils/vxe-table'
	import {watch, reactive, useAttrs, ref} from 'vue'
	import {importBatchContractList, getImportContractList, getHistoryImportContract, exportErrorContract} from '@/api/contract'
	import {VxeGridProps, VxeGridInstance} from 'vxe-table'
	const grid = ref<VxeGridInstance>()
	const attr = useAttrs()
	watch(
		() => attr.visible,
		val => {
			val && grid.value?.commitProxy('reload')
		}
	)
	const gridOptions = reactive<VxeGridProps>({
		height: 'auto',
		showOverflow: true,
		rowConfig: {
			isHover: true
		},
		columns: [
			{
				title: '日期',
				minWidth: 150,
				field: 'confirmTime',
				// width: 100,
				align: 'left'
			},
			{
				title: '操作者',
				minWidth: 150,
				field: 'opUserName',
				// width: 100,
				align: 'left'
			},

			{
				title: '导入结果',
				field: 'opUserRes',
				slots: {
					default: 'opUserRes'
				},
				minWidth: 350,
				align: 'left'
			},

			{
				title: '操作',
				field: 'action',
				slots: {
					default: 'action'
				},
				minWidth: 120,
				align: 'center'
			}
		],
		pagerConfig:{
			...pagerConfig,
			pageSize: 10,
			layouts: ['Total', 'PrevPage', 'JumpNumber', 'NextPage', 'FullJump']
		},
		proxyConfig: {
			props: {
				// 用于列表，读取响应数据，不分页
				list: 'data',
				message: 'msg',
				// 用于分页，读取总条数
				total: 'data.total',
				// 用于分页，读取响应数据
				result: 'data.records'
			},
			ajax: {
				query({page: {currentPage: current, pageSize: size}}) {
					return queryData({...params, current, size})
				}
			}
		}
	})
	const params = reactive<any>({
		shops: null,
		like: null,
		name: null,
		phone: null,
		houseAddress: null,
		expenseBelong: null,
		expenseType: null,
		/** 全部 */
		matchType: null,
		status: 3,
		startTime: null,
		endTime: null,
		tenantType: null
		// 优惠类型字段没有
	})
	const queryData = (params: any) => {
		// houseConfigListState(params).then((res: any) => {
		// 	countObj.value = res.data || {}
		// })
		return getHistoryImportContract(params)
	}
	const downloadFailData = row => {
		exportErrorContract({bizNo: row.bizNo}).then((res: any) => {
			const blob = new Blob([res], {
				type: 'application/vnd.ms-excel;charset=utf-8'
			})
			const link = document.createElement('a')
			link.href = window.URL.createObjectURL(blob)
			link.download = '明智云导入失败数据.xlsx'
			link.click()
		})
	}
</script>
